<template>
	<view>
		<view class="nav">
			
			<uni-nav-bar leftWidth="750rpx"   left-icon="back" leftText="赞" @clickLeft="back"></uni-nav-bar>
		</view>
		<view class="praise">
			<view class="select">
				 <uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="button" activeColor="#4cd964"></uni-segmented-control>
		    </view>   
						<view class="praise-1" v-show="current === 0">
							<!-- <uni-list-item title="头像"  >
								<template v-slot:header>
									<view class="slot-box">
										<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
									</view>					
								</template>
								<template v-slot:body>
									<text class="slot-box slot-text">{{'自定义两侧插槽'}}</text>
									
								</template>
								<template v-slot:footer>
									<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
								</template>
							
							</uni-list-item> -->
						</view>
						
						<view v-show="current === 1">
							<!-- <uni-list-item title="" note="xxxxx" >
								<template v-slot:header>
									<view class="slot-box">
										<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
									</view>					
								</template>
								<template v-slot:body>
									<text class="slot-box slot-text" >自定义两侧插槽</text>
								</template>
								<template v-slot:footer>
									<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
								</template>
							
							</uni-list-item> -->
							选项卡2的内容
						</view>
		    </view>		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				items: ['获赞', '喜欢'],
				current: 0
			}
		},
		methods: {
			onClickItem(e) {
			      if (this.current != e.currentIndex) {
			        this.current = e.currentIndex;
			      }
			    },
			back(){
				uni.switchTab({
					url:'/pages/mine/mine'
				})
			}
		}	
	}
</script>

<style>
.nav{
	
	

	height: 140rpx;
	width: 750rpx;
	display: flex;

	align-items: center;
}
.select{
	
}

.slot-box {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		align-items: center;
	}

	.slot-image {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		margin-right: 10px;
		width: 30px;
		height: 30px;
	}

	.slot-text {
		flex: 1;
		font-size: 14px;
		color: #4cd964;
		
	}
</style>
